import { type ProColumns, ProFormInstance, ProTable } from '@ant-design/pro-components';
import '@umijs/max';
import React, { useEffect, useRef } from 'react';
import { Modal } from 'antd';

export type FormValueType = {
  target?: string;
  template?: string;
  type?: string;
  time?: string;
  frequency?: string;
} & Partial<API.InterfaceInfoVO>;
export type UpdateFormProps = {
  onCancel: (flag?: boolean, formVals?: FormValueType) => void;
  onSubmit: (value: FormValueType) => Promise<void>;
  open:boolean;
  columns: ProColumns<API.InterfaceInfoVO>[]
  values:API.InterfaceInfoVO | undefined
};


const UpdateForm: React.FC<UpdateFormProps> = (props) => {

  const formRef = useRef<ProFormInstance>()

  useEffect(()=>{
    formRef.current?.setFieldsValue(props.values)
    console.log(props.values)
  },[props.values])

  return (
    <Modal
      title={"更新接口"}
      open={props.open}
      onCancel={()=> {props.onCancel?.()}}
      footer={null}
      centered={true}
    >
      <ProTable
        type={"form"}
        columns={props.columns}
        onSubmit={async (value)=>{
          props?.onSubmit(value);
        }}
        formRef={formRef}
      />
    </Modal>
  );
};
export default UpdateForm;
